<template>
  <ul id="patrol-list" v-infinite-scroll="getPatrol" infinite-scroll-disabled="busy"
      infinite-scroll-distance="30">
    <li class="patrol-item" v-for="(item, index) of patrolInfo" :class="{current: isCurrent === index}"
        @click="toggleCurrent(index)">
      <div class="patrol-records-head" :class="[item.isGood ? 'good' : 'bad']">
        <time datetime="2016-11-28">{{item.exactTime | formatDate}}</time>
        <span><i class="ion" :class="isCurrent === index ? 'ion-ios-arrow-up':'ion-ios-arrow-down'"></i></span>
      </div>
      <ul class="patrol-records-body">
        <li v-if="item.improvementArea">

          <h3 class="resultcheck"><i class="ion ion-help-buoy"></i>巡检结果</h3>
          <p>{{item.checkResult}}</p>
        </li>
        <li v-if="item.checkSummary">
          <h3 class="summarize">总结与措施</h3>
          <p>{{item.checkSummary}}</p>
        </li>
        <li v-if="item.goodArea">
          <h3 class="advantage">Good Area</h3>
          <p>{{item.goodArea}}</p>
        </li>
        <li v-if="item.improvementArea">
          <h3 class="limitation">主要问题</h3>
          <p>{{item.improvementArea}}</p>
        </li> 
      </ul>
    </li>
    <!--正在加载提示框-->
    <li is="loading" v-if="loadShow"></li>
    <!--加载失败弹框-->
    <li is="dialog-box" :message="dialogMessage" v-if="dialogShow" @close-dialog="closeDialog"
        @cancle-dialog="closeDialog"></li>
    <li class="no_data" v-if="!patrolInfo.length">
      <i class="ion ion-ios-paper-outline"></i>
      <p>暂无数据
      </p>
    </li>
  </ul>
</template>
<script type="text/javascript">
  import '../../assets/css/patrol_records.scss';
  import interfaceAPI from '../../assets/js/insterface.js';
  import http from '../../assets/js/http_mixin'
  var patrolRecordUrl = interfaceAPI.patrolRecordUrl;
  export default{
    data(){
      return {
        pageTotle: '',             // 页面总数
        count: 0,                  // 计数，记录当前页面的值
        busy: false,
        patrolInfo: [],       // 巡检信息
        isCurrent: 0          // 当前选项
      }
    },
    mixins: [http],
    methods: {
      toggleCurrent: function (index) {
        this.isCurrent = index;
      },
      getPatrol(){
        this.getInfo({
          url: patrolRecordUrl,
          param: {
            'num': this.$route.query.empNo,
            'currentPage': this.count,
            'pageSize': '10'
          },
          success: function (response) {
            var _this = this;
            var responseData = response.body.data;
            this.pageTotle = response.body.pages;
            if (this.pageTotle > this.count) {
              if (responseData.length > 0) {
                for (var i = 0; i < responseData.length; i++) {
                  this.patrolInfo.push(responseData[i]);
                }
                this.patrolInfo.forEach(function (value) {
                  var typeKey = value.typeKey;
                  if (typeKey == '1' || typeKey == '2' || typeKey == '3') {
                    _this.$set(value, 'isGood', true);
                  } else {
                    _this.$set(value, 'isGood', false);
                  }
                });
              }
              this.count++;
            }
            this.busy = false;
            return false;
          },
          fail: function (response) {
            this.dialogMessage = '请求失败，请稍后再试';
            this.dialogShow = true;
          }
        })
      }
    },
    mounted(){
      document.title = '巡检记录';
    }
  }
</script>
